<template>
    <div class="activityContentCss">
      <img :src="props.imgSrc" class="imgPosiCss">
      <div class="titleCss">{{ props.title }}</div>
      <div class="msgCss">{{ props.msg }}</div>
    </div>
  </template>
  <script setup>
  import { ref, onMounted,defineProps, reactive, toRefs, watch, computed } from 'vue';
  const props = defineProps({
  imgSrc: String,
  title: String,
  msg:String
});
  onMounted(() => {
  
  });
  </script>
  <style scoped>
  .activityContentCss{
    margin-top: calc(100vw* 160 / 375);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .imgPosiCss{
    width: calc(100vw* 70 / 375);
    height: calc(100vw* 70 / 375);
  }
  .titleCss{
    /* font-family: 'HONORSansCN-Regular'!important; */
    font-size: calc(100vw* 18 / 375);
    font-weight: 600;
    line-height: calc(100vw* 25 / 375);
    margin-top: calc(100vw* 8 / 375);
  }
  .msgCss{
    /* font-family: 'HONORSansCN-Regular'!important; */
    font-size: calc(100vw* 14 / 375);
    font-weight: 400;
    line-height: calc(100vw* 20 / 375);
    margin-top: calc(100vw* 5 / 375);
    color: #00000099;
  }
  </style>